<template>
	<view>
		<view class="logoTitle">
			<view class="textCenter" style="padding-top: 30px;">
				<view class="logoImg">
					<image src="../../static/logohong.png" mode=""></image>
				</view>
			</view>
			<view class="textCenter" style="font-size: 24px;margin-top: 15px;font-weight: bold;">
				工地云课堂
			</view>

			<view class="textCenter" style="margin-top: 21px;color: #666666;font-size: 14px;">
				第一步：实名验证
			</view>


		</view>
		<view style="width: 80%;margin: 0 auto;">


			<van-field :value="username " type='text' clearable left-icon="user-o" placeholder="请输入姓名" @change="onChangeUserName"
			 size='large'  :border="false "/>


			<van-field :value="idnum" type='idcard' placeholder="请输入身份证后4位" left-icon="notes-o" :border=" false " @change="onChangeIdNum"
			 size='large' />


			<!-- <div style="width: 100%;">
				     <van-button round block type="info" native-type="submit">验证</van-button>
				   </div> -->


			<view style=" margin:42px auto 16px;width: 100%;">
				<van-button @click='clickBtn' type='info' round>验证</van-button>
			</view>
			<view style=" margin:0px auto;width: 80%;text-align: center;font-size: 14px;color:#485AFF;">
				仅限开通项目用户使用
			</view>

			<!-- 	<van-form @submit="onSubmit">
				<van-field v-model="username" name="用户名" label="用户名" placeholder="用户名" :rules="[{ required: true, message: '请填写用户名' }]" />
				<van-field v-model="password" type="password" name="密码" label="密码" placeholder="密码" :rules="[{ required: true, message: '请填写密码' }]" />
				<div style="margin: 16px;">
					<van-button round block type="info" native-type="submit">提交</van-button>
				</div>
			</van-form> -->


		</view>
		<van-dialog id="van-dialog" />

	</view>
</template>

<script>
	import {
		getUserCheck
	} from "../../api/login/index.js"
	import Dialog from '@/wxcomponents/vant-weapp/dialog/dialog.js';
	export default {
		data() {
			return {
				username: '',
				idnum: '',
				showToast: false
			}
		},
		methods: {
			clickBtn() {
				// console.log(this);
				// console.log(this.idnum);
				// this.showToast = true

				getUserCheck({
					fullName: this.username,
					"idNo": this.idnum
				}).then(res => {
					console.log(res);
					if (res.data.code != 200) {
						Dialog.alert({
							title: '验证失败',
							message: res.data.message,
						}).then(() => {
							// on close
						});
					} else {
						uni.setStorageSync('realName', res.data.data)
						uni.setStorageSync('username', this.username)

						uni.navigateTo({
							url: './bindingPhone?username=username'
						});
					}

				})

			},
			onChangeUserName(val) {
				this.username = val.detail
			},
			onChangeIdNum(val) {
				this.idnum = val.detail
			}
		}
	}
</script>

<style scoped>
	.logoTitle {
		text-align: center;
		margin-bottom: 50px;
	}

	.textCenter {
		width: 200px;
		margin: 0 auto;
	}

	.logoImg {
		height: 85px;
		width: 85px;
		margin: 0 auto;
		/* background-color: #7D7E80; */
	}

	::v-deep .van-button--info {
		font-size: 15px;
		color: #fff;
		background-color: #007AFF;
		border: 1px solid #007AFF;
		width: 100%;

	}

	::v-deep .van-cell {
		border-bottom: 1px solid #eee;
		margin-bottom: 20px;

	}

	::v-deep image {
		width: 100%;
		height: 100%;
	}

	::v-deep .van-field__input {
		margin-left: 12px;
	}

	::v-deep .van-icon {
		color: #999;
	}
</style>
